<!DOCTYPE html>
<html>
<head>
    <title>${env("app.name")}</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="${ctxPath}/plugins/fontawesome-free/css/all.min.css">
    <style>
        *, ::after, ::before {
            box-sizing: border-box;
        }
        body {
            margin: 0;
            font-family: "Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
            font-size: 1rem;
            font-weight: 400;
            color: #212529;
            text-align: left;
            background-color: #fff;
        }
        html {
            scroll-behavior: smooth;
        }
        .wrapper, body, html {
            min-height: 100%;
        }
        .login-page, .register-page {
            -ms-flex-align: center;
            align-items: center;
            background: #e9ecef;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            height: 100vh;
            -ms-flex-pack: center;
            justify-content: center;
        }
        html {
            font-family: sans-serif;
            line-height: 1.15;
            -webkit-text-size-adjust: 100%;
            -webkit-tap-highlight-color: transparent;
        }
        :root {
            --blue:#007bff;
            --indigo:#6610f2;
            --purple:#6f42c1;
            --pink:#e83e8c;
            --red:#dc3545;
            --orange:#fd7e14;
            --yellow:#ffc107;
            --green:#28a745;
            --teal:#20c997;
            --cyan:#17a2b8;
            --white:#ffffff;
            --gray:#6c757d;
            --gray-dark:#343a40;
            --primary:#007bff;
            --secondary:#6c757d;
            --success:#28a745;
            --info:#17a2b8;
            --warning:#ffc107;
            --danger:#dc3545;
            --light:#f8f9fa;
            --dark:#343a40;
            --breakpoint-xs:0;
            --breakpoint-sm:576px;
            --breakpoint-md:768px;
            --breakpoint-lg:992px;
            --breakpoint-xl:1200px;
            --font-family-sans-serif:"Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
            --font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
        }
        .login-box, .register-box {
            width: 360px;
        }
        .login-logo, .register-logo {
            font-size: 2.1rem;
            font-weight: 300;
            margin-bottom: 0.9rem;
            text-align: center;
        }
        .card {
            position: relative;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-direction: column;
            flex-direction: column;
            min-width: 0px;
            word-wrap: break-word;
            background-color: #fff;
            background-clip: border-box;
            border: 0 solid rgba(0, 0, 0, .125);
            border-radius: .25rem;
        }
        .card {
            box-shadow: 0px 0px 1px rgba(0,0,0,0.125), 0px 1px 3px rgba(0,0,0,0.2);
            margin-bottom: 1rem;
        }
        .card-body {
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            padding: 0.5rem;
        }
        .login-card-body, .register-card-body {
            background: #fff;
            border-top: 0;
            color: #666;
            padding-right: 20px;
            padding-left: 20px;
        }
        .card-body::after, .card-footer::after, .card-header::after {
            display: block;
            clear: both;
            content: "";
        }
        p {
            margin-top: 0px;
            margin-bottom: 1rem;
        }
        .login-box-msg, .register-box-msg {
            margin: 0;
            text-align: center;
        }
        .input-group {
            position: relative;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -ms-flex-align: stretch;
            align-items: stretch;
            width: 100%;
        }
        .mb-3, .my-3 {
            margin-bottom: 0.3rem !important;
        }
        .row {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            margin-right: -7.5px;
            margin-left: -7.5px;
        }
        .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
            position: relative;
            width: 100%;
            padding-right: 7.5px;
            padding-left: 7.5px;
        }
        .col-4 {
            -ms-flex: 0 0 33.333333%;
            flex: 0 0 33.333333%;
            max-width: 33.33%;
        }
        button {
            border-radius: 0;
        }
        button, input, optgroup, select, textarea {
            margin: 0;
            font-family: inherit;
            font-size: inherit;
            line-height: inherit;
        }
        button, input {
            overflow: visible;
        }
        button, select {
            text-transform: none;
        }
        [type=button], [type=reset], [type=submit], button {
            -webkit-appearance: button;
        }
        .btn {
            display: inline-block;
            font-weight: 400;
            color: #212529;
            text-align: center;
            vertical-align: middle;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            background-color: transparent;
            border: 1px solid transparent;
            padding: .375rem .75rem;
            font-size: 1rem;
            line-height: 1.5;
            border-radius: .25rem;
            transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
        }
        .btn-primary {
            color: #fff;
            background-color: #007bff;
            border-color: #007bff;
            box-shadow: none;
        }
        .btn-block {
            display: block;
            width: 100%;
        }
        [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
            cursor: pointer;
        }
        .form-control {
            display: block;
            width: 100%;
            height: calc(2.25rem + 2px);
            padding: .375rem .75rem;
            font-size: 1rem;
            font-weight: 400;
            line-height: 1.5;
            color: #495057;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #ced4da;
            border-radius: .25rem;
            box-shadow: inset 0px 0px 0px transparent;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
        }
        :-ms-input-placeholder.form-control {
            color: #939ba2;
            opacity: 1;
        }
        .input-group > .custom-file, .input-group > .custom-select, .input-group > .form-control, .input-group > .form-control-plaintext {
            position: relative;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto;
            width: 1%;
            margin-bottom: 0px;
        }
        .input-group > :not(:last-child).custom-select, .input-group > :not(:last-child).form-control {
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
        }
        .login-card-body .input-group .form-control, .register-card-body .input-group .form-control {
            border-right: 0;
        }
        .input-group-append, .input-group-prepend {
            display: -ms-flexbox;
            display: flex;
        }
        .input-group-append {
            margin-left: -1px;
        }
        .input-group-text {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: center;
            align-items: center;
            padding: .375rem .75rem;
            margin-bottom: 0px;
            font-size: 1rem;
            font-weight: 400;
            line-height: 1.5;
            color: #495057;
            text-align: center;
            white-space: nowrap;
            background-color: #e9ecef;
            border: 1px solid #ced4da;
            border-radius: .25rem;
        }
        .input-group > .input-group-append > .btn, .input-group > .input-group-append > .input-group-text, .input-group > :first-child.input-group-prepend > :not(:first-child).btn, .input-group > :first-child.input-group-prepend > :not(:first-child).input-group-text, .input-group > :not(:first-child).input-group-prepend > .btn, .input-group > :not(:first-child).input-group-prepend > .input-group-text {
            border-top-left-radius: 0px;
            border-bottom-left-radius: 0px;
        }
        .login-card-body .input-group .input-group-text, .register-card-body .input-group .input-group-text {
            background-color: transparent;
            border-bottom-right-radius: 0.25rem;
            border-left: 0;
            border-top-right-radius: 0.25rem;
            color: #777;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
        }
        .fa, .fab, .fad, .fal, .far, .fas {
            -moz-osx-font-smoothing: grayscale;
            -webkit-font-smoothing: antialiased;
            display: inline-block;
            font-style: normal;
            font-variant: normal;
            text-rendering: auto;
            line-height: 1;
        }
        .fa, .far, .fas {
            font-family: "Font Awesome 5 Free";
        }
        .fa, .fas {
            font-weight: 900;
        }
        .fa-lock::before {
            content: "\f023";
        }
        .fa-envelope::before {
            content: "\f0e0";
        }
        a {
            color: #007bff;
            text-decoration: none;
            background-color: transparent;
        }
        .login-logo a, .register-logo a {
            color: #495057;
        }
        b, strong {
            font-weight: bolder;
        }
    </style>
    <script type="text/javascript" src="${ctxPath}/plugins/jquery/jquery.min.js?v=${jsVer}"></script>
</head>
<body class="login-page" style="min-height: 311px;background-color: #659EDC">
<div style="display: flex;align-items: center;">
    <div style="width: 540px;height: 540px;" >
        <img src="${ctxPath}/images/1643474952502.png">
    </div>
    <div class="login-box" style="background-color: white;margin-left:20px;padding-top: 15px;border-radius: 10px">
        <div class="login-logo" style="font-weight: 900;font-size: 36px;font-family: HYb9gj;letter-spacing:4px;">
            <b>${env("app.name")}</b>
        </div>
        <!-- /.login-logo -->
            <div class="card-body login-card-body" style="border-radius: 10px">
                <p class="login-box-msg"></p>

                <form action="/login.do" method="post">
                    <div class="input-group mb-3">
                        <input name="code" class="form-control" type="text" placeholder="输入账户名">
                        <div class="input-group-append">
                            <div class="input-group-text">
                                <span class="fas fa-envelope"></span>
                            </div>
                        </div>
                    </div>
                    <div class="input-group mb-3">
                        <input name="password" class="form-control" type="password" placeholder="输入密码">
                        <div class="input-group-append">
                            <div class="input-group-text">
                                <span class="fas fa-lock"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <!-- /.col -->
                        <div class="col-8" style="padding-bottom: 15px">
                            <button class="btn btn-primary btn-block" style="background-color: #659EDC;" type="submit">登录</button>
                        </div>
                        <!-- /.col -->
                    </div>
                </form>
            </div>
            <!-- /.login-card-body -->
    </div>
</div>
<script>
    if(window.top!=window.self)window.top.location="/";
    function getVerify() {
        $("#verify_input").val("");
        $("#imgVerify").attr("src", '/getVerify.do?' + Math.random());//jquery方式
    }
</script>
<!-- /.login-box -->
</body>
</html>
